이미지에서 대표 색상 4~12개를 자동 추출하고 HEX/RGB/HSL·WCAG 대비비율·CSS 변수·팔레트 PNG와 추출 색상 기반 CSS 그라디언트를 브라우저에서만 생성합니다.
JPG, PNG, WebP, GIF, SVG 등 브라우저가 읽을 수 있는 이미지
/* 팔레트 추출 후 CSS가 표시됩니다. */
팔레트 추출기는 샘플링된 픽셀을 요약합니다. 사진 속 어떤 물체가 의미상 중요한지 알지 못합니다. 적절한 색상 수, 샘플링 정밀도 및 대비 참조를 선택한 다음 생성된 팔레트와 그라데이션을 완성된 정답이 아니라 디자인 시작점으로 처리하면 좋은 결과를 얻을 수 있습니다.
4~6가지 색상은 더 명확한 UI 팔레트를 생성하는 반면, 색상 수가 많을수록 복잡한 사진에서 더 많은 강조점이 유지됩니다. 인접한 견본이 거의 동일하게 보이는 경우 중복된 톤을 유지하는 대신 색상 수를 줄이거나 샘플링 정밀도를 높이십시오.
샘플링을 촘촘하게 하면 작은 강조색도 포착할 수 있지만 더 많은 브라우저 작업이 필요합니다. 큰 이미지나 빠른 탐색에는 빠른 샘플링이 적합합니다. 작지만 중요한 색상이 누락된 경우 더 미세한 설정으로 다시 실행하세요.
한 배경에서는 선명하게 보이는 색상이 다른 배경에서는 접근성 대비에 실패할 수 있습니다. 대비 참조를 가이드로 사용한 다음 최종 디자인에 사용된 실제 전경 크기, 무게 및 배경과 텍스트 및 UI 조합을 확인합니다.